<template>
  <div class="">
    <div class="media" v-for="(co, index) in info" :key="index">
      <img class="mr-2 rounded-circle" style="width: 30px;" v-lazy="co.profilePicture ? co.profilePicture : 'static/morentouxiang.png'" alt="">
      <div class="media-body fz-14">
        <p class="mt-0 m-0 text-secondary">{{co.nickName}}</p>
        <p class="mt-0 fz-12 m-0 text-gray-500">{{$formatDateTime(co.commentTime)}}</p>
        <p class="word-break">{{co.commentContent}}</p>
        <div class="media" v-for="com in co.mscsReplyVos" :key="com.commentTime">
          <a class="pr-2" href="#">
            <img class="rounded-circle" :src="com.profilePicture ? com.profilePicture : 'static/morentouxiang.png'" style="width: 30px;" alt="">
          </a>
          <div class="media-body">
            <p class="mt-0 m-0 text-secondary">{{com.nickName}}</p>
            <p class="mt-0 fz-12 text-gray-500">{{$formatDateTime(com.commentTime)}}</p>
            <p class="word-break">{{com.commentContent}}</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "comments",
  title: "评论展示通用组件",
  data () {
    return {}
  },
  props: {
    info: {
      type: Array
    }
  }
}
</script>
